<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	
	<!-- 头，semantic-ui，jquery和me.css -->
	<th:block th:fragment="somehead">
		<meta charset="UTF-8">
    	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    	<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css"> -->
    	<link rel="stylesheet" th:href="@{/css/semantic.min.css}"></link>
    	<script type="text/javascript" th:src="@{/js/jquery-3.5.1.min.js}"></script>
    	<script type="text/javascript" th:src="@{/js/semantic.min.js}"></script>
    	<!-- <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script> -->
    	<link rel="stylesheet" th:href="@{/css/me.css}">
	</th:block>
	
	<th:block th:fragment="blogjscss">
		<link rel="stylesheet" th:href=@{/css/typo.css}>
    	<link rel="stylesheet" th:href=@{/lib/prism/prism.css}>
    	<link rel="stylesheet" th:href=@{/lib/tocbot/tocbot.css}>
    	<script th:src=@{/lib/prism/prism.js}></script>
   		<script th:src=@{/lib/tocbot/tocbot.min.js}></script>
    	<script th:src=@{/lib/qrcode/qrcode.min.js}></script>
    	<script th:src=@{/lib/scrollTo/jquery.scrollTo.min.js}></script>
    	<script th:src=@{/lib/waypoints/jquery.waypoints.min.js}></script>
	</th:block>
	
	<!-- 导航栏 -->
    <nav th:fragment="navmenu(n)" class="ui inverted attached segment m-padded-tb-mini m-shadow-small">
        <div class="ui fluid container">
            <div class="ui inverted secondary stackable menu">
                <h2 class="ui header teal item">Blog</h2>
                <a th:href="@{/}" class="m-item item m-mobile-hide" th:classappend="${n==1} ? 'active'"><i class="home icon"></i>首页</a>
                <a th:href="@{/types/-1}" class="m-item item m-mobile-hide" th:classappend="${n==2} ? 'active'"><i class="idea icon"></i>分类</a>
                <a th:href="@{/tags/-1}" class="m-item item m-mobile-hide" th:classappend="${n==3} ? 'active'"><i class="tags icon"></i>标签</a>
                <a th:href="@{/archives}" class="m-item item m-mobile-hide" th:classappend="${n==4} ? 'active'"><i class="clone icon"></i>归档</a>
                <a th:href="@{/about}" class="m-item item m-mobile-hide" th:classappend="${n==5} ? 'active'"><i class="info icon"></i>关于我</a>
                <a th:href="@{/admin/index}" target="_blank" class="m-item item m-mobile-hide" th:classappend="${n==6} ? 'active'"><i class="edit icon"></i>写博客</a>
                <div class="right m-item item m-mobile-hide">
                	<form name="search-form" th:action="@{/search}" method="post" target="_blank">
                		<div class="ui icon inverted transparent input">
                        <input type="text" name="query" placeholder="Search..." th:value="${query}" />
                        <i onclick="document.forms['search-form'].submit()" class="search link icon"></i>
                    </div>
                	</form>
                    
                </div>
            </div>
        </div>
        <a href="#" class="ui m-menu-toggle black icon button m-right-top m-mobile-show">
            <i class="sidebar icon"></i>
        </a>
    </nav>
    
    <!-- 底部导航栏 -->
    <footer th:fragment="footer" class="ui inverted vertical segment m-padded-tb-massive">
        <div class="ui center aligned container">
            <div class="ui inverted stackable divided grid">
                <div class="three wide column">
                	<h4 class="ui inverted header m-opacity-mini">站长微信</h4>
                    <div class="ui inverted link list">
                        <div class="item">
                            <img src="../static/images/wechat.jpg" th:src="@{/images/wechat.jpg}" class="ui rounded image" alt="wechat" style="width: 80px;">
                        </div>
                    </div>

                </div>
                <div class="four wide column">
                    <h4 class="ui inverted header m-opacity-mini">学习链接</h4>
                    <div class="ui inverted link list">
                    	<a href="https://how2j.cn/k/spring/spring-ioc-di/87.html?p=110062" target="_blank" class="item">Spring教程</a>
                    	<a href="https://how2j.cn/k/springmvc/springmvc-springmvc/615.html?p=110062" target="_blank" class="item">SpringMVC教程</a>
                        <a href="https://how2j.cn/k/mybatis/mybatis-tutorial/1087.html?p=110062" target="_blank" class="item">MyBatis教程</a>
                        <a href="https://how2j.cn/k/tmall_ssm/tmall_ssm-1399/1399.html?p=110062" target="_blank" class="item">SSM天猫商城项目教程</a>
                        <a href="https://how2j.cn/k/tmall_springboot/tmall_springboot-1799/1799.html?p=110062" target="_blank" class="item">SpringBoot天猫商城项目教程</a>
                    </div>
                </div>
                <div class="three wide column">
                    <h4 class="ui inverted header m-opacity-mini">联系我</h4>
                    <div class="ui inverted link list">
                        <p class="item">邮箱: 2711978737@qq.com</p>
                        <p class="item">QQ: 2711978737</p>
                        <p class="item">微信:BLU736917155</p>
                    </div>
                </div>
                <div class="six wide column">
                    <h4 class="ui inverted header m-opacity-mini">联系我</h4>
                    <p class="m-text-thin m-text-spaced m-opacity-mini">Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU Hello! BLU</p>
                </div>
            </div>
            <div class="ui inverted section divider"></div>
            <p class="m-text-thin m-text-spaced m-opacity-default">Copyright ©2020  BLU Blog Designed by BLU</p>
        </div>
    </footer>
    
    
</body>
</html>